const leftBtn = document.getElementById('left');
const rightBtn = document.getElementById('right');

const imgs = document.querySelectorAll('.slide_img');

const body = document.body;

leftBtn.addEventListener('click', () => {
  // 找到当前展示的轮播图下标
  let selIndex = -1;
  imgs.forEach((item, idx) => {
    console.log(item.classList, 'item.classList');
    if (item.classList.contains('active')) {
      selIndex = idx;
    }
  });
  imgs[selIndex].classList.remove('active');
  // 如果下标小于1
  if (selIndex < 1) {
    imgs[imgs.length - 1].classList.add('active');
    body.style.backgroundImage = imgs[imgs.length - 1].style.backgroundImage;
  } else {
    // 如果下标不小于1
    imgs[selIndex - 1].classList.add('active');
  }
});

rightBtn.addEventListener('click', () => {
  // 找到当前展示的轮播图下标
  let selIndex = -1;
  imgs.forEach((item, idx) => {
    if (item.classList.contains('active')) {
      selIndex = idx;
    }
  });
  imgs[selIndex].classList.remove('active');
  if (selIndex < imgs.length - 1) {
    imgs[selIndex + 1].classList.add('active');

    body.style.backgroundImage = imgs[selIndex + 1].style.backgroundImage;
  } else {
    imgs[0].classList.add('active');
  }
});
